<template>
	<view class="incomeList">
		<m-income :pageData="pageData" @goPage="goPage" @clickDetail="clickDetail" :list="list"></m-income>
		<m-popup :show="detail.show" @close="closeDetail">
			<view class="popup-detail">
				<view class="form-text">
					<view class="form-text-item flex-start-nowrap" v-for="(item,index) in detail.list" :key="index">
						<view class="form-text-label c999">{{item.label}}</view>
						<view class="form-text-value">
							<u--text :type="item.mode" :color="!item.mode?'#999999':''" :text="item.value"></u--text>
						</view>
					</view>
				</view>
			</view>
		</m-popup>
	</view>
</template>

<script>
	import {
		dateFormat
	} from "@/utils/index.js"
	export default {
		name:'incomeList',
		data() {
			return {
				list:[],
				model:'',
				detail:{
					show:false,
					list:[{
							tag:'status',
							label:'状态：',
							mode:'success',
							value:'审核通过'
						},{
							tag:'type',
							label:'支付方式：',
							value:'支付宝',
						},{
							tag:'created_at',
							label:'申请时间：',
							value:'2023-3-10 17:53:17',
						},{
							tag:'orderNum',
							label:'支付宝订单号：',
							value:'20230303',
							copy:true,
						},{
							tag:'number',
							label:'支付宝订流水号：',
							value:'20230303',
						},{
							tag:'merchant',
							label:'商家订单号：',
							value:'20230303',
						},{
							tag:'remark',
							label:'申请备注：',
							value:'20230303',
						}
					]
				},
				pageData:{
					"page": 1,
					"page_size": 10,
					total:0
				},
			};
		},
		activated(){
			this.getPageList()
		},
		methods:{
			clickDetail(item){
				// this.detail.show = true;
				if(item.url){
					window.open(item.url)
				}else{
					uni.showToast({
						title:'暂无详情！',
						icon:'none'
					})
				}
			},
			closeDetail(val){
				this.detail.show = false;
			},
			goPage(val){
				this.$emit('setScrollTop')
				this.pageData.page = val
				this.getPageList()
			},
			getPageList(){
					let par = this.pageData
					this.$api.userIncomes(par).then(res => {
						if(res.code == 200){
							res.data.list.map(item => {
								
								item.statusKey = 'read_status'
								item.status = item.status || 1
							})
							this.list = res.data.list || [];
							if(this.list.length){
								this.readMsgIncomeExchange()
							}
							
							this.pageData.total = res.data.count
						}
					})
			},
			readMsgIncomeExchange(){
				let par = {} 
				par.ids = this.list.map(item => { return item.id})
				par.type = '1'
				this.$api.readMsgIncomeExchange(par)
			},
		}
	}
</script>

<style lang="scss">
	.incomeList{
		padding: 0 25px;
	}
	.form-text{
		padding: 15px;
		&-item:not(:last-child){
			padding-bottom: 20px;
		}
	}
</style>
